<template>
  <div class="right-menu-body">
    <div class="menu-top">
      <img @click="tohome" src="../../assets/images/header/m_logo.png" />
      <img src="https://jingye.oss-cn-qingdao.aliyuncs.com/example/mobile/close.png" class="right-menu-close" @click="closeMenu" />
    </div>
    <!-- 服务 -->
    <div class="right-menu-server">
      <div class="right-server-pa" @click="closeMenu">
        <router-link to="/index/index">首页</router-link>
      </div>
      <div class="right-server-pa" @click="closeMenu">
        <router-link to="/product/product">产品介绍</router-link>
      </div>
      <div class="right-server-pa" @click="closeMenu">
        <router-link to="/industry/industry">行业资讯</router-link>
      </div>
      <div class="right-server-pa" @click="closeMenu">
        <router-link to="/about/about">关于我们</router-link>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      menu_show: false
    }
  },
  methods: {
    // 跳转到首页
    tohome() {
      if (this.$route.path == '/index/index') return false
      this.$router.push({ path: '/index/index' })
      this.closeMenu()
    },
    // 跳到服务
    toservice() {
      this.menu_show = this.menu_show ? false : true
      // if (this.$route.path == '/index/service/index') return false
      // this.$router.push('/index/service/index')
      // this.closeMenu()
    },
    closeMenu() {
      this.$emit('close')
    }
  }
}
</script>

<style scoped>
.right-server-name {
  overflow: hidden;
}
.right-server-name > span {
  float: left;
  font-size: 19px;
  font-weight: 500;
  color: rgba(51, 51, 51, 1);
  line-height: 60px;
}
.right-server-name > img {
  float: right;
  height: 10px;
  margin-top: 25px;
}
.right-serve-box {
  height: 160px;
  transition: all 0.3s linear;
  overflow: hidden;
}
.right-serve-box-hide {
  height: 0;
}
.right-server-item {
  /* display: none; */
  font-size: 16px;
  font-weight: 500;
  color: #666;
  line-height: 40px;
}
.right-server-pa {
  font-size: 19px;
  font-weight: 500;
  color: rgba(51, 51, 51, 1);
  line-height: 60px;
  border-top: 1px solid rgba(225, 225, 225, 1);
}
.right-server-pa > a {
  display: block;
  color: rgba(51, 51, 51, 1);
}
.right-menu-body {
  width: 160px;
  padding: 0 20px;
  background: #fff;
  height: 100vh;
}
.menu-top {
  width: 100%;
  height: 60px;
  overflow: hidden;
}
.menu-top > img {
  float: left;
  height: 30px;
  margin-top: 15px;
}
.menu-top > img.right-menu-close {
  float: right;
  height: 14px;
  margin-top: 23px;
}
</style>